var goodid = location.search.slice(1);
var goodList = JSON.parse(localStorage.getItem('looked'));
var goodData;
$.each(goodList, function (index, value) {
    if (value.goodid == goodid) {
        goodData = value;
    }
})
console.log(goodData);
$.each(goodData.goodurls.picsurl, function (index, value) {
    $(`<li><img src=${goodData.goodurls.picsurl[index]} alt=""></li>`).appendTo('.slide-list');
})
$('#min img').attr('src', goodData.goodurls.picsurl[0])
$('#max img').attr('src', goodData.goodurls.picsurl[0])
$('.goods_name').text(goodData.goodtitle)
$('.p_wrap b').text('￥' + goodData.goodzprice);
$('.p_vip span i').text('￥' + goodData.goodzprice);
$('.shop_price s').text('￥' + goodData.goodprice)
$('.si_wrap').eq(4).text('库存' + goodData.sales + '个');
$('.si_wrap').eq(2).children('span').text(goodData.shopname)
$('title').text(goodData.goodtitle);
$('.gtit').text(goodData.goodtitle);
$('.cont>div').eq(2).children('span').text(goodData.goodtype);
$('.cont>div').eq(1).children('span').text(goodData.goodtype);
$('.name').text('商品名称:' + goodData.goodtitle)

// 渲染浏览记录
$('.goods_view ul')
var looked = JSON.parse(localStorage.getItem('looked'));
// console.log(looked);
$.each(looked, function (index, value) {
    // 只渲染五个已浏览
    if (index > 5) {
        return;
    }
    $(`<a href="./details.html?${value.goodid}">
                        <li>
                            <img src="${value.goodurls.nowurl}" width="100%" alt="">
                            <div class="vname">${value.goodtitle}</div>
                            <div class="vprice">${value.goodzprice}</div>
                        </li>
                        </a>
    `).appendTo('.goods_view ul')
})








$('#min').hover(function () {
    $('#mask').show();
    $('#max').show();
}, function () {
    $('#mask').hide();
    $('#max').hide();
});

// 2.蒙版跟随鼠标移动
$('#min').mousemove(function (e) {
    var minX = e.pageX - $('#min').offset().left - $('#mask').width() / 2;
    var minY = e.pageY - $('#min').offset().top - $('#mask').height() / 2;
    // 最大值距离
    var maskmovedisX = $('#min').width() - $('#mask').width();
    var maskmovedisY = $('#min').height() - $('#mask').height();

    if (minX > maskmovedisX) {
        minX = maskmovedisX;
    } else if (minX < 0) {
        minX = 0
    };
    if (minY > maskmovedisY) {
        minY = maskmovedisY;
    } else if (minY < 0) {
        minY = 0
    };
    // 设置蒙版的位置
    $("#mask").css({
        left: minX,
        top: minY
    })

    // 求比例关系
    // 3.蒙版移动,大盒子里的图片也移动
    var radioX = minX / maskmovedisX;
    var radioY = minY / maskmovedisY;

    // 求大图片移动的距离
    $("#maxImg").css({
        left: radioX * ($('#max').width() - $('#maxImg').width()),
        top: radioY * ($('#max').height() - $('#maxImg').height())
    });
});
//点击next
// 点击开关--避免多次点击造成的bug
var flagNext = true;
$(".next").click(function () {
    if (flagNext) {
        flagNext = false;
        $(".prev").prop('disabled', false);
        $(".slide-list").animate({
            left: "-=" + 70
        }, function () {
            if ($(".slide-list").position().left == -210) {
                $('.next').prop('disabled', true);
            };
            flagNext = true;
        });
    }
});

//点击上一个prev
// 点击开关--避免多次点击造成的bug
var flagPrev = true;
$(".prev").click(function () {
    if (flagPrev) {
        flagPrev = false;
        $(".next").prop('disabled', false);
        $(".slide-list").animate({
            left: "+=" + 70
        }, function () {
            if ($(".slide-list").position().left == 0) {
                $(".prev").prop('disabled', true);
            };
            flagPrev = true;
        });

    }
});
//点击slide中的li中的图片
$(".slide-list li").find("img").mouseover(function () {
    var index = $(this).parent().index() //li的索引
    var imgsrc = $(".slide-list li").eq(index).find("img").attr("src")
    $("#min img").attr("src", imgsrc);
    $("#max img").attr("src", imgsrc);
})













$('.view_btn button').eq(0).children().css('color', '#ccc');
var flaga = true;
$('.view_btn button').eq(0).click(function () {
    if (flaga) {
        flaga = false;
        $(this).next().prop('disabled', false);
        $(this).next().children().css('color', 'black')
        $(".goods_view ul").animate({
            top: "+=" + 185
        }, function () {
            if ($(".goods_view ul").position().top == 0) {
                $('.view_btn button').eq(0).prop('disabled', true);
                $('.view_btn button').eq(0).children().css('color', '#ccc');
            };
            flaga = true;
        });
    }
});

//点击上一个prev
// 点击开关--避免多次点击造成的bug
var flagb = true;
$('.view_btn button').eq(1).click(function () {
    if (flagb) {
        flagb = false;
        $(this).prev().prop('disabled', false);
        $(this).prev().children().css('color', 'black')
        $(".goods_view ul").animate({
            top: "-=" + 185
        }, function () {
            console.log($(".goods_view ul").position().top);
            if ($(".goods_view ul").position().top == -555) {
                console.log('123');

                $('.view_btn button').eq(1).prop('disabled', true);
                $('.view_btn button').eq(1).children().css('color', '#ccc');

            }
            flagb = true;
        });

    }
});











$('.tab div').click(function () {
    var index = $(this).index();
    $(this).addClass('active').siblings().removeClass('active');
    $('.mcm-left').css('display', 'none').fadeIn();
    $('.hot').eq(index).fadeIn().siblings('.hot').css('display', 'none');
})



/*

goodcount: "1000"
goodid: "0"
goodprice: "399.00"
goodtitle: "摩飞（Morphyrichards）榨汁机 便携式充电迷你无线果汁机料理机随行杯MR9800 蓝色"
goodtype: "家用电器"
goodurls: {nowurl: 'https://img14.360buyimg.com/n1/s300x300_jfs/t1/107…906/368883/5eaf7085E3cc8d8ef/b2dac719f339e972.jpg', showurl: 'https://x.dscmall.cn/storage/data/uploads/goods/1140/20200826145024337.mp4', picsurl: Array(6)}
goodzprice: "219.00"
pingjia: "5"
sales: "5"
shopname: "创造旗舰店"
*/


// 添加购物车
$('.add').click(function () {
    // 获取当前详情页数据
    var flag = confirm('确定要添加到购物车吗');
    if (flag) {
        var detail;
        $.each(goodList,function(index,value){
            if(value.goodid == goodid){
                detail = value
            }
        })
        detail.num = 1;
        console.log(detail);

        // 判断购物车是否存在
        if (localStorage.getItem('cart')) {
            var data = JSON.parse(localStorage.getItem('cart'));
            // 判断购物车中是否已经存在当前商品
            var flag = true;
            data.forEach((value, index, arr) => {
                if (value.goodid == detail.goodid) {
                    value.num++;
                    flag = false;
                }
            });
            if (flag) {
                data.push(detail);
            }
            localStorage.setItem('cart', JSON.stringify(data));

        } else {
            localStorage.setItem('cart', JSON.stringify([detail]));
        }
        location.reload();
        // 哪个是刷新。。。

    } else {

    }

})










// // 创建存储商品区域
// $(`
// <ul class="cart_list">
// </ul>
// `).appendTo('.aside_right')


// // 侧边栏渲染购物车数据
// var cart = JSON.parse(localStorage.getItem('cart'));
// $.each(cart, function (index, value) {
//     console.log(value);
//     $(`

//     <li class="cart_item">
//             <img src="${value.goodurls.nowurl}" width="80px" height="80px" alt="">
//             <div class="cart_detail">
//                 <p>${value.goodtitle}</p>
//                 <span>￥${value.goodprice}</span>
//             </div>
//             <div class="cart_num2">
//                 <div class="bai" data-gid="${value.goodid}">-</div>
//                 <div class="cart_bailan" ">${value.num}</div>
//                 <div class="lan" data-gid="${value.goodid}">+</div>
//             </div>
//     </li>
//     `).appendTo('.cart_list')
// })




// $('.last_money').children('span').children('span').text(cart.length);
// console.log($('.cart_num'));

// $('.cart_num').text(cart.length);

// // 减少商品数量
// $('.bai').click(function () {
//     var num = Number($(this).next().text()) - 1;
//     var gid = $(this).data('gid');
//     if (num <= 0) {
//         return;
//     } else {
//         $(this).next().text(num);
//         upCart(gid, num);
//         // 这应该能看懂吧？

//     }
// })


// $('.lan').click(function () {
//     var num = Number($(this).prev().text()) + 1;
//     var gid = $(this).data('gid');
//     $(this).prev().text(num);
//     upCart(gid, num);
// })


// // 更新购物车商品对应数量
// function upCart(id, num) {
//     $.each(cart, function (index, value) {
//         if (value.goodid == id) {
//             value.num = num;
//             localStorage.setItem('cart', JSON.stringify(cart))
//         }
//     })
// }



// if(localStorage.getItem('cart')){
//     $('.no_shopping').css('display','none');
// }